{% load static %}
<!DOCTYPE html>
<html>
<head><title>TRANSLATER</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="keywords"
          content="Existing Login Form Widget Responsive, Login Form Web Template, Flat Pricing Tables, Flat Drop-Downs, Sign-Up Web Templates, Flat Web Templates, Login Sign-up Responsive Web Template, Smartphone Compatible Web Template, Free Web Designs for Nokia, Samsung, LG, Sony Ericsson, Motorola Web Design">
    <link href="{% static 'account/css/box.css' %}" rel="stylesheet" type="text/css" media="all"/>
    <link rel="shortcut icon" href="{% static 'account/img/logo.png' %}">
    <link rel="stylesheet" href="{% static 'account/css/style3.css' %}" type="text/css" media="all">
</head>
<body background="{% static 'account/img/translation.jpg' %}">
<h1>TRANSLATER</h1>
<div class="w3layoutscontaineragileits">
    <h2>中英互译</h2>
    <form action="./translate" method="post">
        {% csrf_token %}
        <input type="text" name="translation" placeholder="输入中文或者英文" required>
        <div class="aitssendbuttonw3ls"><input type="submit" value="翻 译">
        </div>
    </form>
</div>

<script type="text/javascript" src="{% static 'account/js/translation2.js' %}"></script>
<script src="{% static 'account/js/translation1.js' %}" type="text/javascript"></script>
<script>        $(document).ready(function () {
    $('.w3_play_icon,.w3_play_icon1,.w3_play_icon2').magnificPopup({
        type: 'inline',
        fixedContentPos: false,
        fixedBgPos: true,
        overflowY: 'auto',
        closeBtnInside: true,
        preloader: false,
        midClick: true,
        removalDelay: 300,
        mainClass: 'my-mfp-zoom-in'
    });
});</script>
</body>
</html>